<template>
  <a-modal title="数据提报" @cancel="cancel" @ok="save"
           v-model:visible="visibleFlag" centered
           :width="400">
    <div class="lable">当前模块数据打包中...</div>
    <div class="value">请稍后至 <span class="export">导入导出</span> 功能模块下载</div>
    <template slot="footer">
      <a-button type="primary" @click="save">直接跳转</a-button>
      <a-button @click="close">关闭</a-button>
    </template>
  </a-modal>
</template>
<script>
export default {
  name: 'Tibao',
  props: {
    visible: {
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {
      visibleFlag: false,
    };
  },
  watch: {
    visible(value) {
      this.visibleFlag = value;
    },
  },
  methods: {
    save() {
      this.$emit('save')
      this.cancel()
    },
    cancel() {
      this.visibleFlag = false;
      this.$emit('update:visible', false);
    },
    close() {
      this.cancel();
    },
  },
};
</script>

<style scoped lang="less">
.lable {
  height: 26px;
  font-family: PingFangSC-Regular;
  font-size: 16px;
  font-weight: bold;
  font-stretch: normal;
  line-height: 26px;
  letter-spacing: 0px;
  color: #666666;
  margin: 20px;
}
.value{
  height: 26px;
  font-family: PingFangSC-Regular;
  font-size: 18px;
  font-weight: bold;
  font-stretch: normal;
  line-height: 26px;
  letter-spacing: 0px;
  color: #666666;
  margin: 20px;
}
.export{
  color: #2377ff ;
}

</style>
